﻿@model Tarasca.Models.CategoriasModel
@using Tarasca.Models;
@using BLLTarasca;

<script type="text/javascript">
    $(document).ready(function () {
        EventBinder($("#btnNuevaCategoria"), "click", nuevaCategoria);
        EventBinder($(".botonEditarCategoria"), "click", editarCategoria);
        EventBinder($(".botonEliminarCategoria"), "click", eliminarCategoria);
        colorearMuestraFilas()
    });

    function eliminarCategoria(e) {
        if (confirm("Eliminar?")) {
            var idCategoria = $(e.currentTarget).attr("idCategoria");

            $.ajax({
                url: '@Url.Content("~/Categorias/Eliminar")',
                data: { idCategoria: idCategoria },
                success:function(){
                    mostrarCategorias();
                },
                error: function (xhr, ajaxOptions, thrownError) {
                    mostrarMensajeGlobalError("Eliminando categoría");
                }
            });
        }
    }

    function colorearMuestraFilas() {
        $(".muestraColorCategoria").each(function () {
            var color = $(this).attr("colorCategoria");
            $(this).css("background-color", color);
        });
    }
</script>
<div class="row">
    <div class="col-md-12">
        <h1>Categorías</h1>
    </div>
</div>
<div class="row">
    <div class="col-md-6">
        <button id="btnNuevaCategoria" class="btn btn-primary">+ Nueva Categoría</button>
    </div>
</div>
<div class="table-responsive grillaCategorias">
    <table class="table table-striped table-hover">
        <tr>
            <th>Color</th>
            <th>Nombre</th>
            <th></th>
            <th></th>
        </tr>
        @foreach (TA_Categoria item in Model.Categorias)
        {
            <tr>
                <td class="col-md-1">
                    <div class="muestraColorCategoria" colorcategoria="@item.Color">
                        
                    </div>
                </td>
                <td class="col-md-9">
                    <span id='@("spanCategoria" + item.IdCategoria)' class="nombreCategoria">@item.Nombre</span>
                </td>
                <td class="col-md-1"><span class="botonEditarCategoria" idCategoria='@Html.Raw(item.IdCategoria.ToString())'>Editar</span></td>
                <td class="col-md-1"><span class="botonEliminarCategoria" idCategoria='@Html.Raw(item.IdCategoria.ToString())'>Eliminar</span></td>
            </tr>
        }
    </table>
</div>

